<template>
	<view class="recommend">
		<view class="title acea-row row-center-wrapper">
			<text class="iconfont icon-zhuangshixian"></text>
			<text class="name">热门推荐</text>
			<text class="iconfont icon-zhuangshixian lefticon"></text>
		</view>
		<view class="recommendList acea-row row-between-wrapper">
			<navigator :url="'/pages/goods_detail/goods_detail?id='+item.id" class="item" v-for="(item,index) in hotData" :key="item">
				<view class="pic"><image :src="item.image" mode=""></image></view>
				<view class="name line1">{{item.store_name}}</view>
				<view class="money">
					￥
					<text>{{item.price}}</text>
				</view>
			</navigator>
		</view>
	</view>
</template>

<script>
	export default{
		props:{
			hotData:{
				type:Array,
				default:[]
			}
		},
		created() {
			
		},
		methods:{
			getHotProduct:function(){
				
			}
		}
	}
</script>

<style scoped>
	.recommend{
		background-color: #fff;
	}
	.recommend .title{
		height: 135rpx;
		font-size: 28rpx;
		color: #282828;
	}
	.recommend .title .iconfont{
		font-size: 170rpx;
		color: #454545;
	}
	.recommend .title .lefticon{
		transform: rotate(180deg);
	}
	.recommend .title .name{
		margin: 0 28rpx;
	}
	.recommend .recommendList{
		padding: 0 30rpx;
	}
	.recommend .recommendList .item{
		width: 335rpx;
		margin-bottom: 30rpx;
	}
	.recommend .recommendList .item .pic{
		width: 100%;
		height: 335rpx;
		position: relative;
	}
	.recommend .recommendList .item .name{
		font-size: 28rpx;
		color: #282828;
		margin-top: 20rpx;
	}
	.recommend .recommendList .item .money{
		font-size: 20rpx;
		margin-top: 8rpx;
	}
	.recommend .recommendList .item .money text{
		font-size: 28rpx;
	}
</style>